@charset "UTF-8";

/* 全局样式修改 */
html,
body,
div,
span,
iframe,
map,
font,
img,
a img,
samp,
strong,
hr,
h1,
h2,
h3,
h4,
h5,
h6,
b,
p,
blockquote,
a,
address,
code,
dl,
dt,
dd,
ol,
ul,
li,
form,
label,
table,
tr,
td,
th {
	padding: 0;
	margin: 0;
	border: 0;
	font-weight: normal;
	font-family: sm, 'Microsoft YaHei', Arial, Helvetica, sans-serif;
}

input::-webkit-inner-spin-button {
	-webkit-appearance: none;
}

input[type="number"] {
	-moz-appearance: textfield;
}

textarea {
	font-family: "微软雅黑";
}

ol,
ul {
	list-style: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-size: 100%;
}

a:link {
	text-decoration: none;
}

a:visited {
	text-decoration: none;
}

a:hover {
	text-decoration: none;
}

a:active {
	text-decoration: none;
}

input,
select {
	font-family: 'Microsoft YaHei', Arial, Helvetica, sans-serif;
}

i {
	font-style: normal;
}

a {
	blr: expression(this.onFocus=this.blur());
}

a:focus {
	outline: none;
}

a.hidefocus {
	outline: none;
}

.fl {
	float: left;
}

.fr {
	float: right;
}

input[type=text],
input[type=submit],
input[type=button] {
	-webkit-appearance: none;
	/*去除iPhone input默认样式}*/
}

input {
	outline: none;
}

.clearfix:after {
	display: block;
	content: "";
	clear: both;
	height: 0;
	overflow: hidden;
}

.clearfix {
	zoom: 1;
}

body {
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	font-size: 12px;
}

.clear {
	clear: both;
}

div,
ul,
li,
input {
	box-sizing: border-box;
}

em,
i,
strong {
	font-style: normal;
}

::-webkit-scrollbar {
	width: 3px;
	height: 3px;
}

::-webkit-scrollbar-thumb {
	border-radius: 1em;
	background-color: rgba(50, 50, 50, 0.3);
}

::-webkit-scrollbar-track {
	border-radius: 1em;
	background-color: #fff;
}

body {
	font-family: '微软雅黑';
}

.w {
	width: 1201px;
	margin: 0 auto;
}

figure {
	margin: 0;
}

@media screen and (max-width: 1100px) {
	.w {
		width: 100%;
	}
}

.header {
	background: #fff;
}

.header .head {
	position: relative;
	display: flex;
	align-items: center;
	height: 80px;
	gap: 20px;
	padding: 0 20px;
}

.header .head .gather {
	display: flex;
	align-items: center;
	flex: 1;
	overflow: hidden;
	gap: 52px;
}

.header .head .gather .select {
	flex: 1;
	user-select: none;
	overflow: hidden;
	height: auto;
}

.header .head .gather .select ul {
	display: flex;
	align-items: center;
	overflow-x: auto;
	gap: 48px;
	height: 39px;
	padding-left: 20px;
	box-sizing: border-box;
}

.header .head .gather .select ul li {
	position: relative;
}

.header .head .gather .select ul li a {
	font-size: 18px;
	color: #727477;
	white-space: nowrap;
}

.header .head .gather .select ul .active::after {
	position: absolute;
	left: 50%;
	bottom: 0;
	transform: translate(-50%, 50%);
	content: '';
	border: 5px solid transparent;
	border-bottom-color: #428de5;
}

.header .head .gather .select ul .active a {
	color: #428de5;
}

.header .head .assist {
	display: flex;
	align-items: center;
	gap: 10px;
}

.header .head .assist button {
	width: 65px;
	height: 40px;
	border-radius: 10px;
	background: #009dfe;
	border: none;
	font-size: 17px;
	color: #fff;
	box-shadow: rgba(0, 0, 0, 0.14) 0px 6px 16px 0px;
	cursor: pointer;
}

.header .head .assist button:first-child {
	background: #fff;
	color: #727477;
}

.header .head .assist .menu {
	display: none;
	position: relative;
	display: flex;
	align-items: center;
	width: 40px;
	height: 30px;
	cursor: pointer;
	display: none;
}

.header .head .assist .menu span {
	width: 100%;
	height: 10%;
	background: #727477;
}

.header .head .assist .menu::after {
	position: absolute;
	bottom: 0;
	left: 0;
	content: '';
	width: 100%;
	height: 10%;
	background: #727477;
	transition: all 0.29s cubic-bezier(0, 0, 0, 1);
}

.header .head .assist .menu::before {
	position: absolute;
	left: 0;
	top: 0;
	content: '';
	width: 100%;
	height: 10%;
	background: #727477;
	transition: all 0.29s cubic-bezier(0, 0, 0, 1);
}

.header .head .assist .hide span {
	display: none;
}

.header .head .assist .hide::after {
	top: 50%;
	left: 58%;
	transform: rotate(-45deg) translate(-50%, -50%);
	transform-origin: bottom left;
}

.header .head .assist .hide::before {
	top: 53%;
	left: 50%;
	transform: rotate(45deg) translate(-50%, -50%);
	transform-origin: top left;
}

.footer {
	width: 100%;
	background: #010b12;
	padding: 75px 0;
	box-sizing: border-box;
}

.footer .info {
	display: flex;
	flex-direction: column;
	gap: 30px;
	align-items: center;
}

.footer .info p {
	color: #fff;
	font-size: 13px;
	text-align: center;
}

.footer .info p a {
	color: #fff;
}

.footer .info>p a {
	color: #fff;
}

.footer .footerBox {
	display: flex;
	height: auto;
	align-items: stretch;
}

.footer .footerBox dl {
	width: 100%;
	padding: 0 30px;
	box-sizing: border-box;
	border-right: 2px solid #fff;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.footer .footerBox dl:last-child {
	border: none;
}

.footer .footerBox dl dt {
	color: #fff;
	font-size: 16px;
}

.footer .footerBox dl dd ul {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
}

.footer .footerBox dl dd ul li {
	color: #fff;
	font-size: 14px;
}

.footer .footerBox dl dd ul li a {
	color: #fff;
}

.banner {
	height: 360px;
	background: url(../public/img/banner_bj.png) no-repeat;
	background-size: cover;
	background-position: center;
}

.banner .introduce {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
}

.banner .introduce>span {
	font-size: 48px;
	color: #fff;
	margin-bottom: 33px;
	user-select: none;
	white-space: nowrap;
}

.banner .introduce>p {
	font-size: 14px;
	color: #fff;
	user-select: none;
	white-space: nowrap;
}

.banner .introduce .search {
	margin-top: 67px;
	margin-bottom: 20px;
	width: 560px;
	height: 70px;
	padding: 13px;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	background: #fff;
	border-radius: 20px;
	box-shadow: rgba(0, 0, 0, 0.08) 0px 2px 4px 0px, rgba(0, 0, 0, 0.06) 0px 2px 12px 0px;
}

.banner .introduce .search input {
	flex: 1;
	height: 100%;
	border: none;
}

.banner .introduce .search button {
	width: 122px;
	height: 100%;
	border: none;
	background: #0290e9;
	cursor: pointer;
	border-radius: 5px;
	box-shadow: rgba(0, 0, 0, 0.08) 0px 2px 4px 0px, rgba(0, 0, 0, 0.06) 0px 2px 12px 0px;
}

.banner .introduce .search button span {
	font-size: 25px;
	color: #fff;
}

.banner .introduce .mark {
	display: flex;
	align-items: center;
	gap: 10px;
}

.banner .introduce .mark li a {
	font-size: 12px;
	color: #fff;
}

.banner .introduce .mark .active a {
	color: #0290e9;
}

.index_main {
	padding-top: 55px;
	padding-bottom: 195px;
	box-sizing: border-box;
}

.main {
	background: #3e7eaa;
}

.main .back {
	position: fixed;
	right: 3%;
	top: 50%;
	background: #009dfe;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	cursor: pointer;
	display: none;
	text-align: center;
	line-height: 30px;
	user-select: none;
	z-index: 999;
}

.main .back span {
	display: block;
	transform: rotate(-90deg);
	color: #fff;
	font-size: 18px;
}

.main .title {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 38px;
}

.main .title .illustrate {
	display: flex;
	align-items: center;
	gap: 15px;
}

.main .title .illustrate img {
	width: 28px;
	height: auto;
}

.main .title .illustrate span {
	font-size: 20px;
}

.main .title .see {
	display: flex;
}

.main .title .see .linkBox {
	display: flex;
	align-items: center;
	gap: 20px;
}

.main .title .see .linkBox>span {
	font-size: 16px;
	color: #252f41;
}

.main .title .see .linkBox .mark {
	width: 24px;
	height: 24px;
	background: #009dfe;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50px;
}

.main .title .see .linkBox .mark span {
	color: #fff;
	font-size: 14px;
	user-select: none;
	font-weight: bold;
}

.main .videoentry ul {
	display: flex;
	flex-wrap: wrap;
	gap: 15px;
}

.main .videoentry ul li {
	width: calc(100% / 3 - 10px);
	height: 273px;
	border-radius: 15px;
	overflow: hidden;
	box-shadow: rgba(0, 30, 43, 0.1) 0px 3px 4px 0px;
}

.main .videoentry ul li .linkBox {
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
}

.main .videoentry ul li .cover {
	position: relative;
	height: 185px;
	width: 100%;
}

.main .videoentry ul li .cover .Image {
	width: 100%;
	height: 100%;
}

.main .videoentry ul li .cover .play {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 95px;
	height: 85px;
}

.main .videoentry ul li .cover .play img {
	width: 100%;
	height: 100%;
}

.main .videoentry ul li .cover time {
	position: absolute;
	left: 8px;
	top: 8px;
	color: #fff;
	font-size: 14px;
	white-space: nowrap;
}

.main .videoentry ul li .cover .duration {
	position: absolute;
	right: 8px;
	bottom: 8px;
	color: #fff;
	font-size: 14px;
	white-space: nowrap;
}

.main .videoentry ul li .prove {
	flex: 1;
	width: 100%;
	background: rgba(0, 157, 254, 0.5);
	padding: 10px 20px;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.main .videoentry ul li .prove p {
	white-space: nowrap;
	overflow: hidden;
	display: block;
	width: 100%;
	text-overflow: ellipsis;
	color: #fff;
	font-size: 14px;
}

.main .videoentry ul li .prove .hot {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.main .videoentry ul li .prove .hot .source {
	font-size: 14px;
	color: #fff;
	white-space: nowrap;
}

.main .videoentry ul li .prove .hot .heat {
	display: flex;
	align-items: center;
	gap: 10px;
}

.main .videoentry ul li .prove .hot .heat span {
	font-size: 14px;
	color: #fff;
	white-space: nowrap;
}

.main .videoentry ul li .prove .hot .heat .iconfont {
	color: #fe5d7c;
	font-size: 14px;
}

.main .upMatch {
	width: 100%;
	border-radius: 10px;
	padding: 20px;
	box-sizing: border-box;
	background: #fff;
	padding-bottom: 50px;
}

.main .upMatch .up_swiper {
	position: relative;
	padding: 0 50px;
}

.main .upMatch .up_swiper .mySwiper {
	position: unset;
}

.main .upMatch .up_swiper .mySwiper .swiper-slide {
	display: flex;
	flex-direction: column;
	gap: 15px;
	background: rgba(0, 157, 254, 0.5);
	border-radius: 10px;
	padding: 15px;
	box-sizing: border-box;
	box-shadow: rgba(0, 30, 43, 0.1) 0px 3px 4px 0px;
}

.main .upMatch .up_swiper .mySwiper .swiper-slide .introBox {
	display: flex;
	justify-content: space-between;
}

.main .upMatch .up_swiper .mySwiper .swiper-slide .introBox .intro {
	display: flex;
	flex-direction: column;
}

.main .upMatch .up_swiper .mySwiper .swiper-slide .introBox .intro time,
.main .upMatch .up_swiper .mySwiper .swiper-slide .introBox .intro span {
	color: #fff;
	font-size: 14px;
}

.main .upMatch .up_swiper .mySwiper .swiper-slide .introBox .status {
	display: flex;
}

.main .upMatch .up_swiper .mySwiper .swiper-slide .introBox .status img {
	vertical-align: middle;
	width: 30px;
	height: 19px;
}

.main .upMatch .up_swiper .mySwiper .swiper-slide .introBox .status span {
	font-size: 12px;
	color: #fff;
}

.main .upMatch .up_swiper .mySwiper .swiper-slide .contest {
	display: grid;
	grid-template-columns: 2fr 1.5fr 2fr;
	align-items: center;
}

.main .upMatch .up_swiper .mySwiper .swiper-slide .contest .team {
	width: 100%;
}

.main .upMatch .up_swiper .mySwiper .swiper-slide .contest .team .linkBox {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 13px;
}

.main .upMatch .up_swiper .mySwiper .swiper-slide .contest .team .linkBox img {
	width: auto;
	height: 65px;
	user-select: none;
}

.main .upMatch .up_swiper .mySwiper .swiper-slide .contest .team .linkBox span {
	white-space: nowrap;
	overflow: hidden;
	display: block;
	width: 100%;
	text-overflow: ellipsis;
	text-align: center;
	font-size: 14px;
	color: #fff;
}

.main .upMatch .up_swiper .mySwiper .swiper-slide .contest .vs {
	display: flex;
	flex-direction: column;
}

.main .upMatch .up_swiper .mySwiper .swiper-slide .contest .vs .score {
	display: grid;
	align-items: center;
	grid-template-columns: 2fr 1fr 2fr;
	gap: 5px;
}

.main .upMatch .up_swiper .mySwiper .swiper-slide .contest .vs .score span {
	font-size: 26px;
	color: #fff;
	font-weight: bold;
	text-align: center;
}

.main .upMatch .up_swiper .mySwiper .swiper-slide .contest .vs .state {
	font-size: 14px;
	color: #fff;
	text-align: center;
}

.main .upMatch .up_swiper .mySwiper .swiper-button-next:after,
.main .upMatch .up_swiper .mySwiper .swiper-button-prev:after {
	display: none;
}

.main .upMatch .up_swiper .mySwiper .swiper-button-next,
.main .upMatch .up_swiper .mySwiper .swiper-button-prev {
	width: 0;
	height: 0;
	border: 20px solid transparent;
	top: 50%;
	transform: translateY(-50%);
	margin-top: 0;
}

.main .upMatch .up_swiper .mySwiper .swiper-button-next {
	border-left-color: #009dfe;
	right: 0;
}

.main .upMatch .up_swiper .mySwiper .swiper-button-prev {
	border-right-color: #009dfe;
	left: 0;
}

.main .newssuggest {
	width: 100%;
	border-radius: 10px;
	padding: 20px;
	box-sizing: border-box;
	background: #fff;
	padding-bottom: 50px;
	margin: 75px 0;
}

.main .newssuggest .newssuggestBox {
	display: flex;
	gap: 40px;
}

.main .newssuggest .newssuggestBox .diagram {
	width: 59%;
}

.main .newssuggest .newssuggestBox .diagram ul {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
}

.main .newssuggest .newssuggestBox .diagram ul li {
	width: calc(100% / 2 - 8px);
	height: 228px;
}

.main .newssuggest .newssuggestBox .diagram ul li:hover img {
	transform: scale(1.2);
}

.main .newssuggest .newssuggestBox .diagram ul li figure {
	height: 100%;
	height: 100%;
	overflow: hidden;
}

.main .newssuggest .newssuggestBox .diagram ul li figure .cover {
	width: 100%;
	height: 174px;
	border-radius: 10px;
	overflow: hidden;
}

.main .newssuggest .newssuggestBox .diagram ul li figure img {
	width: 100%;
	height: 100%;
	transition: all, 0.5s;
}

.main .newssuggest .newssuggestBox .diagram ul li:nth-child(2) {
	margin-right: 15px;
}

.main .newssuggest .newssuggestBox .diagram ul li:nth-child(2) figure,
.main .newssuggest .newssuggestBox .diagram ul li:nth-child(3) figure {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.main .newssuggest .newssuggestBox .diagram ul li:nth-child(2) figure img,
.main .newssuggest .newssuggestBox .diagram ul li:nth-child(3) figure img {
	border-radius: 10px;
}

.main .newssuggest .newssuggestBox .diagram ul li:nth-child(2) figure figcaption,
.main .newssuggest .newssuggestBox .diagram ul li:nth-child(3) figure figcaption {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	overflow: hidden;
	-webkit-line-clamp: 2;
	font-size: 16px;
	color: #19222f;
	width: 100%;
	flex: 1;
}

.main .newssuggest .newssuggestBox .diagram ul li:first-child {
	width: 100%;
	height: 354px;
	margin-bottom: 20px;
}

.main .newssuggest .newssuggestBox .diagram ul li:first-child figure {
	position: relative;
	border-radius: 15px;
	overflow: hidden;
}

.main .newssuggest .newssuggestBox .diagram ul li:first-child figure .cover {
	width: 100%;
	height: 100%;
}

.main .newssuggest .newssuggestBox .diagram ul li:first-child figure img {
	width: 100%;
	height: 100%;
}

.main .newssuggest .newssuggestBox .diagram ul li:first-child figure figcaption {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	background: rgba(133, 136, 146, 0.8);
	padding: 15px 20px;
	box-sizing: border-box;
	white-space: nowrap;
	overflow: hidden;
	display: block;
	width: 100%;
	text-overflow: ellipsis;
	font-size: 18px;
	color: #fff;
}

.main .newssuggest .newssuggestBox .text {
	flex: 1;
	overflow: hidden;
}

.main .newssuggest .newssuggestBox .text ul {
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 18px;
}

.main .newssuggest .newssuggestBox .text ul li {
	width: 100%;
}

.main .newssuggest .newssuggestBox .text ul li:hover .linkBox::before {
	background: #19222f !important;
}

.main .newssuggest .newssuggestBox .text ul li:hover .linkBox span {
	color: #19222f !important;
	font-weight: bold !important;
}

.main .newssuggest .newssuggestBox .text ul li:first-child .linkBox::before {
	background: #19222f;
}

.main .newssuggest .newssuggestBox .text ul li:first-child .linkBox span {
	color: #19222f;
	font-weight: bold;
}

.main .newssuggest .newssuggestBox .text ul li .linkBox {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
}

.main .newssuggest .newssuggestBox .text ul li .linkBox::before {
	content: '';
	width: 6px;
	height: 6px;
	background: #555b65;
	border-radius: 50%;
}

.main .newssuggest .newssuggestBox .text ul li .linkBox span {
	flex: 1;
	white-space: nowrap;
	overflow: hidden;
	display: block;
	width: 100%;
	text-overflow: ellipsis;
	font-size: 14px;
	color: #555b65;
}

.main .newssuggest .newssuggestBox .text ul li:nth-child(11) {
	margin-top: 10px;
}

.main .newssuggest .newssuggestBox .text ul li:nth-child(11) .linkBox::before {
	background: #19222f;
}

.main .newssuggest .newssuggestBox .text ul li:nth-child(11) .linkBox span {
	color: #19222f;
	font-weight: bold;
}

.main .wonderfulVideo {
	width: 100%;
	border-radius: 10px;
	padding: 20px;
	box-sizing: border-box;
	background: #fff;
	padding-bottom: 50px;
	margin: 75px 0;
}

.main .ranking {
	width: 100%;
	border-radius: 10px;
	padding: 20px;
	box-sizing: border-box;
	background: #fff;
	padding-bottom: 50px;
}

.main .ranking .billboard {
	display: flex;
	flex-wrap: wrap;
	gap: 37px;
}

.main .ranking .billboard .integral {
	width: calc(100% / 2 - 19px);
	background: rgba(0, 157, 254, 0.5);
	padding: 8px 0;
	border-radius: 15px;
	overflow: hidden;
}

.main .ranking .billboard .integral .integral_title {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	user-select: none;
}

.main .ranking .billboard .integral .integral_title img {
	height: 35px;
	width: auto;
}

.main .ranking .billboard .integral .integral_title span {
	font-size: 18px;
	color: #fff;
	font-weight: bold;
}

.main .ranking .billboard .integral .switch {
	background: #e9dabd;
	padding: 10px;
	margin: 12px 0;
	box-sizing: border-box;
}

.main .ranking .billboard .integral .switch ul {
	display: flex;
	align-items: center;
	gap: 15px;
}

.main .ranking .billboard .integral .switch ul li {
	flex: 1;
	height: 35px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 18px;
	color: #252f41;
	border-radius: 10px;
}

.main .ranking .billboard .integral .switch ul li a {
	color: #252f41;
	white-space: nowrap;
}

.main .ranking .billboard .integral .switch ul .active {
	color: #fff;
	background: #009dfe;
}

.main .ranking .billboard .integral .switch ul .active a {
	color: #fff;
}

.main .ranking .billboard .integral .within {
	width: 100%;
}

.main .ranking .billboard .integral .within ul {
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 20px;
	padding: 0 15px;
	box-sizing: border-box;
}

.main .ranking .billboard .integral .within ul li {
	width: 100%;
	display: grid;
	grid-template-columns: 1fr 3fr 1fr 1fr;
	align-items: center;
}

.main .ranking .billboard .integral .within ul li span {
	font-size: 16px;
	color: #fff;
	white-space: nowrap;
	text-align: center;
}

.main .ranking .billboard .integral .within ul li span:nth-child(1),
.main .ranking .billboard .integral .within ul li span:nth-child(2) {
	text-align: left;
}

.main .ranking .billboard .integral .within ul li .position {
	background: url(../public/img/position4.png) no-repeat;
	background-size: cover;
	background-position: center;
	width: 22px;
	height: 25px;
	text-align: center;
	margin-left: 8px;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	color: #fff;
}

.main .ranking .billboard .integral .within ul li:nth-child(2) .position {
	background: url(../public/img/position1.png) no-repeat;
	background-size: 100% 100%;
	background-position: center;
	width: 36px;
	height: 25px;
	margin-left: 0;
}

.main .ranking .billboard .integral .within ul li:nth-child(3) .position {
	background: url(../public/img/position2.png) no-repeat;
	background-size: 100% 100%;
	background-position: center;
	width: 36px;
	height: 25px;
	margin-left: 0;
}

.main .ranking .billboard .integral .within ul li:nth-child(4) .position {
	background: url(../public/img/position3.png) no-repeat;
	background-size: 100% 100%;
	background-position: center;
	width: 36px;
	height: 25px;
	margin-left: 0;
}

.main .ranking .billboard .integral .within ul li .linkBox {
	display: flex;
	width: 100%;
	overflow: hidden;
}

.main .ranking .billboard .integral .within ul li .team {
	display: flex;
	align-items: center;
	width: 100%;
	gap: 15px;
	overflow: hidden;
}

.main .ranking .billboard .integral .within ul li .team img {
	width: auto;
	height: 30px;
}

.main .ranking .billboard .integral .within ul li .team span {
	flex: 1;
	font-size: 16px;
	color: #fff;
	text-align: left;
	white-space: nowrap;
	overflow: hidden;
	display: block;
	width: 100%;
	text-overflow: ellipsis;
}

.main .eventMatch {
	margin-top: 75px;
	width: 100%;
	border-radius: 10px;
	padding: 20px;
	box-sizing: border-box;
	background: #fff;
	padding-bottom: 50px;
}

.main .eventMatch .videoSelect {
	position: relative;
	padding: 0 50px;
	margin-bottom: 43px;
	box-sizing: border-box;
}

.main .eventMatch .videoSelect .mySwiper {
	position: unset;
	border-radius: 15px;
	padding: 10px 20px;
	box-sizing: border-box;
}

.main .eventMatch .videoSelect .mySwiper .swiper-slide {
	display: flex;
	flex-direction: column;
	gap: 20px;
	align-items: center;
	cursor: pointer;
}

.main .eventMatch .videoSelect .mySwiper .swiper-slide img {
	width: 60px;
	height: 60px;
	user-select: none;
	border-radius: 50%;
	border: 1px solid transparent;
}

.main .eventMatch .videoSelect .mySwiper .swiper-slide span {

	font-size: 16px;
	font-weight: bold;
	color: #333;
}

.main .eventMatch .videoSelect .mySwiper .active img {
	border: 1px solid #009dfe;
}

.main .eventMatch .videoSelect .mySwiper .active span {
	color: #009dfe;
}

.main .eventMatch .videoSelect .mySwiper .swiper-button-next:after,
.main .eventMatch .videoSelect .mySwiper .swiper-button-prev:after {
	display: none;
}

.main .eventMatch .videoSelect .mySwiper .swiper-button-next,
.main .eventMatch .videoSelect .mySwiper .swiper-button-prev {
	width: 0;
	height: 0;
	border: 20px solid transparent;
	margin-top: 0;
	top: 50%;
	transform: translateY(-50%);
}

.main .eventMatch .videoSelect .mySwiper .swiper-button-next {
	border-left-color: #009dfe;
	right: 0;
}

.main .eventMatch .videoSelect .mySwiper .swiper-button-prev {
	border-right-color: #009dfe;
	left: 0;
}

.main .eventMatch .tabulate {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.main .eventMatch .tabulate .every {
	background: rgba(0, 157, 254, 0.5);
	display: flex;
	flex-direction: column;
	padding: 20px;
	box-sizing: border-box;
	gap: 15px;
	border-radius: 15px;
}

.main .eventMatch .tabulate .every .every_title {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 15px;
}

.main .eventMatch .tabulate .every .every_title img {
	width: 20px;
	height: 20px;
}

.main .eventMatch .tabulate .every .every_title span {
	font-size: 18px;
	font-weight: bold;
	color: #fff;
}

.main .eventMatch .tabulate .every .arrange {
	display: grid;
	align-items: center;
	grid-template-columns: 2fr 1fr 1fr 1fr 5fr 1fr;
}

.main .eventMatch .tabulate .every .arrange span,
.main .eventMatch .tabulate .every .arrange time,
.main .eventMatch .tabulate .every .arrange a {
	font-size: 14px;
	color: #fff;
	white-space: nowrap;
}

.main .eventMatch .tabulate .every .arrange .ranks {
	display: grid;
	grid-template-columns: 3fr 1fr 3fr;
	align-items: center;
	gap: 10px;
}

.main .eventMatch .tabulate .every .arrange .ranks .linkBox {
	width: 100%;
	overflow: hidden;
	display: flex;
}

.main .eventMatch .tabulate .every .arrange .ranks .team {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	overflow: hidden;
}

.main .eventMatch .tabulate .every .arrange .ranks .team img {
	width: 25px;
	height: auto;
}

.main .eventMatch .tabulate .every .arrange .ranks .team span {
	flex: 1;
	white-space: nowrap;
	overflow: hidden;
	display: block;
	width: 100%;
	text-overflow: ellipsis;
}

.main .eventMatch .tabulate .every .arrange .ranks .linkBox:first-child .team span {
	text-align: right;
}

.main .eventMatch .tabulate .every .arrange .ranks .score {
	display: grid;
	align-items: center;
	grid-template-columns: 2fr 1fr 2fr;
}

.main .eventMatch .tabulate .every .arrange .ranks .score span {
	text-align: center;
	font-size: 16px;
}

.main .eventMatch .tabulate .every .arrange .status {
	position: relative;
	width: 100px;
	height: 25px;
	border-radius: 17px;
	background: rgba(253, 98, 69, 0.3);
	z-index: 2;
}

.main .eventMatch .tabulate .every .arrange .status .linkBox {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
}

.main .eventMatch .tabulate .every .arrange .status .linkBox img {
	width: 15px;
	height: 15px;
}

.main .eventMatch .tabulate .every .arrange .status .linkBox span {
	color: #fd6445;
}

.main .eventMatch .tabulate .every .arrange .start::after {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgba(253, 98, 69, 0.3);
	border-radius: 17px;
	animation: flicker 2s linear infinite reverse;
	z-index: 1;
	pointer-events: none;
}

.main .eventMatch .tabulate .every .arrange .end {
	background: rgba(145, 148, 151, 0.3);
}

.main .eventMatch .tabulate .every .arrange .end .linkBox span {
	color: #555b65;
}

.main .eventMatch .tabulate .every .arrange .wait {
	background: #009dfe;
}

.main .eventMatch .tabulate .every .arrange .wait .linkBox span {
	color: #fff;
}

@keyframes flicker {
	0% {
		transform: scale(1);
		background: rgba(253, 98, 69, 0);
	}

	50% {
		transform: scale(1.2);
		background: rgba(253, 98, 69, 0.2);
	}

	100% {
		transform: scale(1);
		background: rgba(253, 98, 69, 0);
	}
}

.comm_main {
	padding-top: 15px;
	padding-bottom: 100px;
}

.main .simall_title {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 22px;
}

.main .simall_title .leftregion {
	display: flex;
	align-items: center;
	gap: 10px;
}

.main .simall_title .leftregion img {
	width: auto;
	height: 20px;
}

.main .simall_title .leftregion span {
	font-size: 14px;
	color: #727477;
}

.main .simall_title .rightregion {
	display: flex;
}

.main .simall_title .rightregion a {
	display: flex;
	align-items: center;
	gap: 10px;
}

.main .simall_title .rightregion a img {
	width: auto;
	height: 16px;
}

.main .simall_title .rightregion a span {
	font-size: 14px;
	color: #d1d4d6;
	white-space: nowrap;
}

.main .page {
	width: 100%;
	display: flex;
	justify-content: center;
	background: #fff;
	width: 100%;
	border-radius: 10px;
	padding: 20px;
	box-sizing: border-box;
	background: #fff;
	padding-bottom: 50px;
	padding: 20px;
	margin-top: 20px;
}

.main .page .pagination {
	display: flex;
	gap: 10px;
}

.main .page .pagination li {
	width: 38px;
	height: 38px;
	border: 1px solid #eeeeee;
}

.main .page .pagination li span,
.main .page .pagination li a {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #52524e;
	font-size: 14px;
}

.main .page .pagination .active {
	background: #009dfe;
}

.main .page .pagination .active span {
	color: #fff;
}

.main .page .pagination .disabled {
	cursor: pointer;
	user-select: none;
}

.main .page .pagination .disabled span {
	color: #cdcdcd;
}

.main .page .pagination .omit {
	cursor: default;
	width: auto;
	border: none;
}

.main .principalBox {
	display: flex;
	gap: 20px;
}

.main .principalBox .principal {
	width: 67%;
}

.main .principalBox .principal .toggle {
	width: 100%;
	width: 100%;
	border-radius: 10px;
	padding: 20px;
	box-sizing: border-box;
	background: #fff;
	padding-bottom: 50px;
	padding: 10px 20px;
	border-radius: 20px;
}

.main .principalBox .principal .toggle ul {
	display: flex;
	align-items: center;
	gap: 15px;
}

.main .principalBox .principal .toggle ul li {
	flex: 1;
	height: 34px;
}

.main .principalBox .principal .toggle ul li a {
	display: flex;
	width: 100%;
	height: 100%;
	align-items: center;
	justify-content: center;
	color: #727477;
	font-size: 14px;
	white-space: nowrap;
}

.main .principalBox .principal .toggle ul .active {
	background: #009dfe;
	border-radius: 10px;
}

.main .principalBox .principal .toggle ul .active a {
	color: #fff;
}

.main .principalBox .principal .videolist {
	margin-top: 20px;
}

.main .principalBox .principal .videolist ul li .prove {
	background: #fff;
}

.main .principalBox .principal .videolist ul li .prove p {
	color: #727477;
}

.main .principalBox .principal .videolist ul li .prove .hot .heat span {
	color: #727477;
}

.main .principalBox .principal .videolist ul li .prove .hot .source {
	color: #727477;
}

.main .principalBox .principal .videolist ul li .prove .hot .heat .iconfont {
	color: #31d7ff;
}

.main .principalBox .aside {
	flex: 1;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	gap: 20px;
}

.main .principalBox .aside .popular {
	width: 100%;
	border-radius: 10px;
	padding: 20px;
	box-sizing: border-box;
	background: #fff;
	padding-bottom: 50px;
}

.main .principalBox .aside .popular ul {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.main .principalBox .aside .popular ul li {
	color: #727477;
	font-size: 14px;
}

.main .principalBox .aside .popular ul li a {
	color: #727477;
	font-size: 14px;
	white-space: nowrap;
}

.main .principalBox .aside .recent {
	width: 100%;
	border-radius: 10px;
	padding: 20px;
	box-sizing: border-box;
	background: #fff;
	padding-bottom: 50px;
}

.main .principalBox .aside .recent .competition ul {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.main .principalBox .aside .recent .competition ul li {
	display: flex;
	flex-direction: column;
	gap: 11px;
}

.main .principalBox .aside .recent .competition ul li .detailed {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.main .principalBox .aside .recent .competition ul li .detailed span,
.main .principalBox .aside .recent .competition ul li .detailed time {
	white-space: nowrap;
	color: #727477;
	font-size: 12px;
}

.main .principalBox .aside .recent .competition ul li .contest {
	display: flex;
	align-items: center;
	gap: 20px;
}

.main .principalBox .aside .recent .competition ul li .contest .corps {
	flex: 1;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.main .principalBox .aside .recent .competition ul li .contest .corps .team {
	width: 100%;
	overflow: hidden;
}

.main .principalBox .aside .recent .competition ul li .contest .corps .team .linkBox {
	width: 100%;
	display: flex;
	align-items: center;
	gap: 8px;
}

.main .principalBox .aside .recent .competition ul li .contest .corps .team .linkBox img {
	width: auto;
	height: 28px;
}

.main .principalBox .aside .recent .competition ul li .contest .corps .team .linkBox span {
	font-size: 14px;
	color: #727477;
	flex: 1;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.main .principalBox .aside .recent .competition ul li .contest .status {
	width: 86px;
	height: 28px;
	background: #009dfe;
	border-radius: 14px;
}

.main .principalBox .aside .recent .competition ul li .contest .status a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	color: #fff;
	font-size: 14px;
}

.main .principalBox .aside .information {
	width: 100%;
	border-radius: 10px;
	padding: 20px;
	box-sizing: border-box;
	background: #fff;
	padding-bottom: 50px;
}

.main .principalBox .aside .information .collection ul {
	display: flex;
	flex-direction: column;
	gap: 5px;
}

.main .principalBox .aside .information .collection ul li {
	display: flex;
}

.main .principalBox .aside .information .collection ul li:hover a p {
	border-bottom: 1px dashed #009dfe;
	font-weight: bold;
}

.main .principalBox .aside .information .collection ul li a {
	display: flex;
	width: 100%;
	align-items: center;
	gap: 5px;
}

.main .principalBox .aside .information .collection ul li img {
	width: auto;
	height: 20px;
}

.main .principalBox .aside .information .collection ul li p {
	flex: 1;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	color: #727477;
	font-size: 14px;
	box-sizing: border-box;
	padding: 10px 0;
	border-bottom: 1px solid transparent;
}

.main .principalBox .aside .videosuggest {
	width: 100%;
	border-radius: 10px;
	padding: 20px;
	box-sizing: border-box;
	background: #fff;
	padding-bottom: 50px;
}

.main .principalBox .aside .videosuggest .collect ul {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.main .principalBox .aside .videosuggest .collect ul li .linkBox {
	display: flex;
	gap: 10px;
}

.main .principalBox .aside .videosuggest .collect ul li .linkBox .cover {
	position: relative;
	width: 168px;
	height: 83px;
	border-radius: 15px;
	overflow: hidden;
}

.main .principalBox .aside .videosuggest .collect ul li .linkBox .cover .Img {
	width: 100%;
	height: 100%;
}

.main .principalBox .aside .videosuggest .collect ul li .linkBox .cover .play {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 40px;
	height: 35px;
}

.main .principalBox .aside .videosuggest .collect ul li .linkBox .cover .play img {
	width: 100%;
	height: 100%;
}

.main .principalBox .aside .videosuggest .collect ul li .linkBox .cover span {
	position: absolute;
	right: 8px;
	bottom: 8px;
	font-size: 12px;
	color: #fff;
}

.main .principalBox .aside .videosuggest .collect ul li .linkBox .clear {
	flex: 1;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.main .principalBox .aside .videosuggest .collect ul li .linkBox .clear p {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	overflow: hidden;
	-webkit-line-clamp: 2;
	font-size: 14px;
	color: #7d7f82;
}

.main .principalBox .aside .videosuggest .collect ul li .linkBox .clear time {
	width: 100%;
	text-align: right;
	font-size: 12px;
	color: #7d7f82;
}

.newslistBox {
	width: 100%;
	border-radius: 10px;
	padding: 20px;
	box-sizing: border-box;
	background: #fff;
	padding-bottom: 50px;
	margin-top: 20px;
}

.newslistBox .newslist ul {
	display: flex;
	flex-direction: column;
	gap: 19px;
}

.newslistBox .newslist ul li figure {
	display: flex;
	gap: 10px;
}

.newslistBox .newslist ul li figure .Img {
	width: 255px;
	height: 143px;
	border-radius: 15px;
}

.newslistBox .newslist ul li figure figcaption {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	flex: 1;
	overflow: hidden;
}

.newslistBox .newslist ul li figure figcaption article {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.newslistBox .newslist ul li figure figcaption article span {
	font-size: 16px;
	color: #727477;
	white-space: nowrap;
	overflow: hidden;
	display: block;
	width: 100%;
	text-overflow: ellipsis;
}

.newslistBox .newslist ul li figure figcaption article p {
	font-size: 14px;
	color: #727477;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	overflow: hidden;
	-webkit-line-clamp: 2;
}

.newslistBox .newslist ul li figure figcaption .intel {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.newslistBox .newslist ul li figure figcaption .intel time {
	font-size: 12px;
	white-space: nowrap;
	color: #b1b2b3;
}

.newslistBox .newslist ul li figure figcaption .intel .heat {
	display: flex;
	align-items: center;
	gap: 5px;
}

.newslistBox .newslist ul li figure figcaption .intel .heat span {
	color: #b1b2b3;
	font-size: 12px;
	white-space: nowrap;
}

.newslistBox .newslist ul li figure figcaption .intel .heat .iconfont {
	font-size: 16px;
	color: #34ecff;
}

.crumbs {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 20px;
	background: #fff;
	border-radius: 15px;
	padding: 20px;
}

.crumbs span {
	font-size: 16px;
	color: #727477;
	white-space: nowrap;
	display: flex;
	align-items: center;
	gap: 10px;
}

.crumbs span::before {
	content: '';
	width: 4px;
	height: 12px;
	border-radius: 6px;
	background: #727477;
}

.crumbs ul {
	display: flex;
	align-items: center;
	flex: 1;
	overflow: hidden;
	padding-right: 20px;
}

.crumbs ul li {
	display: flex;
	align-items: center;
}

.crumbs ul li a {
	color: #727477;
	font-size: 14px;
	white-space: nowrap;
}

.crumbs ul li::after {
	content: '>';
	font-size: 14px;
	color: #333;
	margin: 0 5px;
}

.crumbs ul li:last-child {
	flex: 1;
	overflow: hidden;
}

.crumbs ul li:last-child a {
	color: #76a8ea;
	white-space: nowrap;
	overflow: hidden;
	display: block;
	width: 100%;
	text-overflow: ellipsis;
}

.crumbs ul li:last-child::after {
	display: none;
}

.main .article h1 {
	font-size: 24px;
	white-space: nowrap;
	overflow: hidden;
	display: block;
	width: 100%;
	text-overflow: ellipsis;
	text-align: center;
	color: #727477;
	font-weight: bold;
}

.main .article .newsInfo {
	border-top: 2px solid #dee2e6;
	padding-top: 10px;
	padding-bottom: 20px;
	margin-top: 10px;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
}

.main .article .newsInfo time,
.main .article .newsInfo span {
	font-size: 12px;
	color: #d0d3d8;
	white-space: nowrap;
}

.main .article img {
	margin: 0 auto;
	width: 80% !important;
	height: auto;
	display: block;
	padding: 25px 0 25px 0;
	border-radius: 15px;
}

.main .article>p {
	font-size: 14px;
	color: #727477;
	text-indent: 24px;
	line-height: 24px;
	margin-bottom: 20px;
}

.main .news {
	width: 100%;
	border-radius: 10px;
	padding: 20px;
	box-sizing: border-box;
	background: #fff;
	padding-bottom: 50px;
}

.main .news .upDown {
	margin-top: 115px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
}

.main .news .upDown li {
	padding: 7px;
	box-sizing: border-box;
	border: 1px solid #c5c9cc;
	border-radius: 16px;
}

.main .news .upDown li a {
	font-size: 12px;
	color: #727477;
	white-space: nowrap;
}

.main .news .treetop {
	display: flex;
	align-items: center;
	padding: 14px 10px;
	border: 1px solid #c5c9cc;
	gap: 10px;
	margin-top: 20px;
}

.main .news .treetop span {
	font-size: 14px;
	color: #727477;
}

.main .news .treetop ul {
	display: flex;
	align-items: center;
	gap: 10px;
}

.main .news .treetop ul li {
	padding: 2px 7px;
	border: 1px solid #c5c9cc;
}

.main .news .treetop ul li a {
	font-size: 14px;
	color: #727477;
	white-space: nowrap;
}

.main .correlation {
	margin-top: 24px;
	width: 100%;
	border-radius: 10px;
	padding: 20px;
	box-sizing: border-box;
	background: #fff;
	padding-bottom: 50px;
}

.main .correlation .correlationlist ul {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.main .correlation .correlationlist ul li figure {
	display: flex;
	gap: 10px;
}

.main .correlation .correlationlist ul li figure .cover {
	position: relative;
	width: 255px;
	height: 143px;
	border-radius: 15px;
	overflow: hidden;
}

.main .correlation .correlationlist ul li figure .cover .Img {
	width: 100%;
	height: 100%;
}

.main .correlation .correlationlist ul li figure .cover .play {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 50px;
	height: 45px;
}

.main .correlation .correlationlist ul li figure .cover .play img {
	width: 100%;
	height: 100%;
}

.main .correlation .correlationlist ul li figure .cover span {
	position: absolute;
	right: 5px;
	bottom: 5px;
	font-size: 12px;
	color: #fff;
	white-space: nowrap;
}

.main .correlation .correlationlist ul li figure figcaption {
	flex: 1;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.main .correlation .correlationlist ul li figure figcaption article {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.main .correlation .correlationlist ul li figure figcaption article span {
	font-size: 16px;
	color: #727477;
	white-space: nowrap;
	overflow: hidden;
	display: block;
	width: 100%;
	text-overflow: ellipsis;
}

.main .correlation .correlationlist ul li figure figcaption article p {
	font-size: 14px;
	color: #727477;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	overflow: hidden;
	-webkit-line-clamp: 2;
}

.main .correlation .correlationlist ul li figure figcaption time {
	width: 100%;
	text-align: right;
	font-size: 12px;
	color: #727477;
}

.video {
	width: 100%;
	border-radius: 10px;
	padding: 20px;
	box-sizing: border-box;
	background: #fff;
	padding-bottom: 50px;
}

.video .screen {
	position: relative;
	width: 100%;
	height: 355px;
	border-radius: 15px;
	overflow: hidden;
}

.video .screen .Img {
	width: 100%;
	height: 100%;
}

.video .screen .play {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 156px;
	height: 140px;
}

.video .screen .play img {
	width: 100%;
	height: 100%;
}

.video .gameBox {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.video .gameBox .topInfo {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.video .gameBox .topInfo time,
.video .gameBox .topInfo span {
	font-size: 14px;
	white-space: nowrap;
	color: #727477;
	user-select: none;
}

.video .gameBox .game {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
	height: 212px;
	background: url(../public/img/game_bj.png) no-repeat;
	background-size: 100% 100%;
	background-position: center;
}

.video .gameBox .game .team {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 15px;
}

.video .gameBox .game .team img {
	width: auto;
	height: 84px;
}

.video .gameBox .game .team span {
	font-size: 16px;
	color: #fff;
	text-align: center;
	width: 150px;
}

.video .gameBox .game .vs {
	display: flex;
	flex-direction: column;
}

.video .gameBox .game .vs time {
	font-size: 18px;
	color: #fff;
	white-space: nowrap;
	margin-bottom: 33px;
}

.video .gameBox .game .vs .score {
	display: grid;
	grid-template-columns: 2fr 1fr 2fr;
	align-items: center;
}

.video .gameBox .game .vs .score span {
	text-align: center;
	font-size: 36px;
	color: #fff;
	user-select: none;
}

.video .gameBox .game .vs .score span:first-child {
	text-align: right;
}

.video .gameBox .game .vs .score span:last-child {
	text-align: left;
}

.video .gameBox .game .vs .status {
	font-size: 18px;
	color: #fff;
	text-align: center;
	white-space: nowrap;
	margin-top: 20px;
}

.video .signal {
	display: flex;
	align-items: center;
	margin: 20px 0;
	gap: 15px;
}

.video .signal span {
	font-size: 14px;
	color: #009dfe;
	display: flex;
	align-items: center;
	gap: 5px;
	white-space: nowrap;
}

.video .signal span::before {
	content: '';
	width: 3px;
	height: 15px;
	background: #009dfe;
}

.video .signal ul {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
}

.video .signal ul li a {
	font-size: 16px;
	font-weight: bold;
	color: #87898c;
	white-space: nowrap;
	animation: scaletext 2s linear infinite forwards;
	display: inline-block;
}

@keyframes scaletext {
	0% {
		transform: scale(1);
	}

	50% {
		transform: scale(0.6);
	}

	100% {
		transform: scale(1);
	}
}

.video .liveInfo {
	display: flex;
	flex-direction: column;
	gap: 15px;
}

.video .liveInfo ul {
	display: flex;
	flex-direction: column;
	gap: 15px;
}

.video .liveInfo ul li {
	display: flex;
	align-items: center;
	gap: 10px;
}

.video .liveInfo ul li span {
	font-size: 14px;
	color: #009dfe;
	font-weight: bold;
}

.video .liveInfo ul li a {
	font-size: 14px;
	white-space: nowrap;
	color: #c1c4c8;
}

.video .liveInfo p {
	font-size: 14px;
	color: #7c7e81;
	line-height: 24px;
}

.confrontatiom {
	margin-top: 35px;
	width: 100%;
	border-radius: 10px;
	padding: 20px;
	box-sizing: border-box;
	background: #fff;
	padding-bottom: 50px;
}

.confrontatiom .election {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 20px;
}

.confrontatiom .election ul {
	display: flex;
	align-items: center;
	gap: 20px;
}

.confrontatiom .election ul li {
	padding: 8px 17px;
	border-radius: 10px;
}

.confrontatiom .election ul li a {
	display: flex;
	font-size: 16px;
	color: #727477;
	white-space: nowrap;
}

.confrontatiom .election ul .active {
	background: #009dfe;
}

.confrontatiom .election ul .active a {
	color: #fff;
}

.confrontatiom .view {
	overflow: hidden;
}

.confrontatiom .view>ul {
	display: flex;
}

.confrontatiom .view>ul>li {
	width: 100%;
	height: 100%;
}

.confrontatiom .view>ul>li .view_title {
	display: flex;
	align-items: center;
	gap: 5px;
	margin-bottom: 10px;
}

.confrontatiom .view>ul>li .view_title img {
	width: 22px;
	height: auto;
}

.confrontatiom .view>ul>li .view_title span {
	font-size: 16px;
	color: #727477;
}

.confrontatiom .view>ul>li .history .record ul {
	display: flex;
	flex-direction: column;
	gap: 20px;
}


.confrontatiom .view>ul>li .history .record ul li .jump_link {
	display: grid;
	grid-template-columns: 2fr 1fr 1fr 1fr 1fr;
	align-items: center;
}

.confrontatiom .view>ul>li .history .record ul li span,
.confrontatiom .view>ul>li .history .record ul li time {
	text-align: center;
	color: #727477;
	font-size: 14px;
}

.confrontatiom .view>ul>li .history .record ul .first {
	background-color: #009dfe;
	height: 33px;
	border-radius: 10px;
	display: grid;
	align-items: center;
	grid-template-columns: repeat(5, 1fr);
}

.confrontatiom .view>ul>li .history .record ul .first span {
	color: #fff;
}

.confrontatiom .view>ul>li .military {
	margin-top: 20px;
}

.confrontatiom .view>ul>li .military .warband {
	display: flex;
}

.confrontatiom .view>ul>li .military .warband .team {
	width: calc(100% / 2);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 7px;
}

.confrontatiom .view>ul>li .military .warband .team:first-child {
	position: relative;
}

.confrontatiom .view>ul>li .military .warband .team:first-child::after {
	content: '';
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 1px;
	height: 47px;
	background: #d0d3d8;
}

.confrontatiom .view>ul>li .military .warband .team .troops {
	display: flex;
	align-items: center;
	gap: 10px;
}

.confrontatiom .view>ul>li .military .warband .team .troops img {
	width: auto;
	height: 40px;
}

.confrontatiom .view>ul>li .military .warband .team .troops span {
	color: #727477;
	font-size: 16px;
	font-weight: bold;
}

.confrontatiom .view>ul>li .military .warband .team>p {
	font-size: 16px;
	color: #727477;
	font-weight: bold;
}

.confrontatiom .view>ul>li .military .table {
	width: 100%;
	text-align: center;
	margin-top: 20px;
}

.confrontatiom .view>ul>li .military .table ul {
	width: 100%;
	border-bottom: 1px solid #d0d3d8;
}

.confrontatiom .view>ul>li .military .table ul li {
	width: 100%;
	display: grid;
	align-items: center;
	grid-template-columns: repeat(4, 1fr);
	border-top: 1px solid #d0d3d8;
	height: 53px;
}

.confrontatiom .view>ul>li .military .table ul li span {
	width: 100%;
	height: 100%;
	text-align: center;
	line-height: 53px;
	border-right: 1px solid #d0d3d8;
	font-size: 14px;
	color: #727477;
}

.confrontatiom .view>ul>li .military .table ul li span:last-child {
	border-right: none;
}

.main .view ul li .introduce {
	background: #f8f8f8;
	padding: 13px 15px;
}

.main .view ul li .introduce .eventName {
	margin: 12px 0;
}

.main .view ul li .introduce .eventName ul {
	display: flex;
	flex-direction: column;
	gap: 15px;
}

.main .view ul li .introduce .eventName ul li {
	display: flex;
	align-items: center;
}

.main .view ul li .introduce .eventName ul li::before {
	content: '';
	width: 4px;
	height: 4px;
	background: #e5e5e5;
	border-radius: 50%;
	margin-right: 10px;
}

.main .view ul li .introduce .eventName ul li span {
	font-size: 14px;
	color: #626161;
	white-space: nowrap;
}

.main .view ul li .introduce .eventName ul li a {
	color: #3c3cb4;
	font-size: 14px;
	white-space: nowrap;
	flex: 1;
	overflow: hidden;
	text-overflow: ellipsis;
}

.main .view ul li .introduce .text {
	color: #626161;
	font-size: 14px;
}

.analysis {
	width: 100%;
	height: 100%;
	box-shadow: transparent 0px 0px 0px 0px, transparent 0px 0px 0px 0px, rgba(0, 0, 0, 0.16) 0px 4px 16px 0px;
	margin-top: 59px;
	box-sizing: border-box;
}

.analysis ul {
	display: flex;
}

.analysis ul li {
	position: relative;
	width: calc(100% / 3);
	height: auto;
	background: #fff;
	padding: 0 24px;
	box-sizing: border-box;
	padding-bottom: 30px;
	box-sizing: border-box;
}

.analysis ul li .likenessBox {
	position: absolute;
	left: 50%;
	top: 0;
	transform: translate(-50%, -40%);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 11px;
}

.analysis ul li .likeness {
	width: 83px;
	height: 83px;
	border-radius: 50%;
	border: 1px solid #e8e8e8;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #fff;
}

.analysis ul li .likeness img {
	width: 53px;
	height: 53px;
	border-radius: 50%;
}

.analysis ul li .likenessBox span {
	font-size: 16px;
	color: #333333;
}

.analysis ul li .likenessBox span a {
	color: #333;
}

.analysis ul .neutrality {
	background: #f7f7f8;
}

.analysis ul .neutrality::after {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	transform: translateY(-100%);
	width: 100%;
	height: 4px;
	background: #009dfe;
}

.analysis ul li .placeBox {
	padding-top: 88px;
	display: flex;
	flex-direction: column;
	gap: 28px;
}

.analysis ul li .place .place_title {
	font-size: 18px;
	display: flex;
	align-items: center;
	gap: 5px;
}

.analysis ul li .place .place_title::before {
	content: '';
	width: 4px;
	height: 28px;
}

.analysis ul li .favorable .place_title {
	color: #de1e30;
}

.analysis ul li .favorable .place_title::before {
	background: #de1e30;
}

.analysis ul li .unlucky .place_title {
	color: #56a4d5;
}

.analysis ul li .unlucky .place_title::before {
	background: #56a4d5;
}

.analysis ul li .neutralityBox .place_title {
	color: #ecbf08;
	justify-content: center;
}

.analysis ul li .neutralityBox .place_title::before {
	display: none;
}

.analysis ul li .place .vessel {
	display: flex;
	gap: 40px;
}

.analysis ul li .place .vesselBox {
	margin-top: 16px;
}

.analysis ul li .place .vessel .mark {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.analysis ul li .place .vessel .mark span {
	width: 5px;
	height: 5px;
	background: red;
	border-radius: 50%;
	display: flex;
	flex-direction: column;
}

.analysis ul li .favorable .vessel .mark span {
	background: #de1e30;
}

.analysis ul li .unlucky .vessel .mark span {
	background: #56a4d5;
}

.analysis ul li .place .vessel .mark::before {
	content: '';
	width: 3px;
	height: 18px;
	background: #e9eaee;
}

.analysis ul li .place .vessel .mark::after {
	content: '';
	width: 3px;
	flex: 1;
	background: #e9eaee;
}

.analysis ul li .place .vessel .text p {
	font-size: 12px;
	color: #838383;
}

.analysis ul li .place .vessel .text p:first-child {
	padding-bottom: 31px;
	padding-top: 13px;
}

.main .matchlist .eventMatch {
	margin-top: 20px;
}

.main .matchlist .eventMatch .tabulate .every {
	background: transparent;
}

.main .matchlist .eventMatch .tabulate .every .arrange span,
.main .matchlist .eventMatch .tabulate .every .arrange time,
.main .matchlist .eventMatch .tabulate .every .arrange a {
	color: #727477;
}

.big {
	display: flex;
	gap: 20px;
}

.big .bigSelect {
	flex: 1;
}

.big .bigSelect ul {
	display: flex;
	flex-direction: column;
	gap: 5px;
	background: #fff;
	padding: 20px 5px;
	box-sizing: border-box;
	border-radius: 10px;
}

.big .bigSelect ul li {
	padding: 10px 20px;
	display: flex;
	align-items: center;
	gap: 16px;
	border-radius: 15px;
	cursor: pointer;
	user-select: none;
}

.big .bigSelect ul li img {
	width: 30px;
	height: auto;
}

.big .bigSelect ul li span {
	font-size: 14px;
	color: #727477;
}

.big .bigSelect ul .active {
	background: #009dfe;
}

.big .bigSelect ul .active span {
	color: #fff;
}

.big .bigContent {
	width: 100%;
	border-radius: 10px;
	padding: 20px;
	box-sizing: border-box;
	background: #fff;
	padding-bottom: 50px;
	width: 72%;
}

.big .bigContent ul {
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.big .bigContent ul li {
	display: grid;
	grid-template-columns: 1fr 1fr 3fr 1fr;
	align-items: center;
}

.big .bigContent ul li time,
.big .bigContent ul li span,
.big .bigContent ul li a {
	color: #727477;
	font-size: 12px;
}

.big .bigContent ul li .troop {
	display: grid;
	align-items: center;
	grid-template-columns: 2fr 1fr 2fr;
}

.big .bigContent ul li .troop .team {
	width: 100%;
	overflow: hidden;
}

.big .bigContent ul li .troop .team .linkBox {
	width: 100%;
	display: flex;
	align-items: center;
	gap: 10px;
}

.big .bigContent ul li .troop .team .linkBox img {
	width: auto;
	height: 33px;
}

.big .bigContent ul li .troop .team .linkBox span {
	flex: 1;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	text-align: center;
	text-align: left;
}

.big .bigContent ul li .troop .team:first-child .linkBox span {
	text-align: right;
}

.big .bigContent ul li .troop .vs {
	text-align: center;
	font-size: 16px;
	color: #727477;
	white-space: nowrap;
}

.big .bigContent ul li .status {
	font-size: 18px;
	color: #727477;
	white-space: nowrap;
	text-align: right;
}

.multiple {
	display: flex;
	flex-direction: column;
	gap: 20px;
	width: 100%;
	border-radius: 10px;
	padding: 20px;
	box-sizing: border-box;
	background: #fff;
	padding-bottom: 50px;
	margin-top: 30px;
}

.multiple .multiple_title {
	display: flex;
	align-items: center;
	user-select: none;
	gap: 10px;
}

.multiple .multiple_title img {
	width: 23px;
	height: auto;
}

.multiple .multiple_title span {
	font-size: 16px;
	color: #727477;
}

.multiple ul {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.multiple ul li a {
	color: #354455;
	font-size: 14px;
}

@media screen and (min-width: 1001px) {
	.header .head .gather .select {
		width: 100%;
		height: 40px !important;
	}
}

@media screen and (max-width: 1100px) {
	.main {
		padding-left: 10px;
		padding-right: 10px;
	}
}

@media screen and (max-width: 1000px) {
	.header .head .assist .btn {
		display: none;
	}

	.header .head .assist .menu {
		display: flex;
	}

	.header .head .gather .select {
		position: absolute;
		top: 80px;
		left: 0;
		z-index: 999;
		width: 100%;
		background: #fff;
		overflow-y: auto;
	}

	.header .head .gather .select ul {
		flex-direction: column;
		height: auto;
	}

	.main .ranking .billboard .integral .switch ul li {
		font-size: 14px;
	}

	.main .ranking .billboard {
		gap: 20px;
	}

	.main .ranking .billboard .integral {
		width: calc(100% / 2 - 10px);
	}

	.main .principalBox {
		flex-direction: column;
	}

	.main .principalBox .principal {
		width: 100%;
	}

	.main .principalBox .aside .information .collection ul {
		flex-direction: row;
		flex-wrap: wrap;
	}

	.main .principalBox .aside .information .collection ul li {
		width: calc(100% / 2 - 3px);
	}

	.main .principalBox .aside .recent .competition ul li {
		width: calc(100% / 2 - 10px);
	}

	.main .principalBox .aside .recent .competition ul {
		flex-direction: row;
		flex-wrap: wrap;
	}

	.big {
		flex-direction: column;
	}

	.big .bigSelect ul {
		flex-direction: row;
	}

	.big .bigSelect ul li {
		padding: 5px;
		flex: 1;
		border-radius: 10px;
	}

	.big .bigContent {
		width: 100%;
	}
}

@media screen and (max-width: 750px) {
	.main {
		padding-left: 1.33333vw;
		padding-right: 1.33333vw;
	}

	.main .article>p {
		font-size: calc(18vw / 7.5);
	}

	.header .head {
		height: 12vw;
		gap: 2.66667vw;
		padding: 0 2.66667vw;
	}

	.header .head .gather .logo img {
		width: 18.53333vw;
		height: 6.4vw;
	}

	.header .head .assist .menu {
		width: 6vw;
		height: 4.66667vw;
	}

	.header .head .gather .select {
		top: 12vw;
	}

	.header .head .gather .select ul {
		gap: 6.4vw;
		padding-left: 2.66667vw;
	}

	.header .head .gather .select ul li a {
		font-size: 12px;
	}

	body .footer .info p {
		font-size: calc(16vw / 7.5);
		padding: 0 calc(5vw / 7.5);
	}

	.banner {
		height: 65.33333vw;
	}

	.banner .introduce>span {
		font-size: 6.4vw;
		margin-bottom: 4.4vw;
	}

	.banner .introduce>p {
		font-size: 2.4vw;
	}

	.banner .introduce .search {
		margin-top: 8.93333vw;
		margin-bottom: 2.66667vw;
		width: 74.66667vw;
		height: 9.33333vw;
		padding: 1.73333vw;
		border-radius: 2.66667vw;
	}

	.banner .introduce .search button {
		width: 16.26667vw;
	}

	.banner .introduce .search input::placeholder {
		font-size: 2.4vw;
	}

	.banner .introduce .search button span {
		font-size: 3.33333vw;
	}

	.banner .introduce .mark {
		gap: 1.33333vw;
	}

	.banner .introduce .mark li a {
		font-size: 2.4vw;
	}

	.footer {
		padding: 10vw 0;
	}

	.footer .footerBox dl {
		padding: 0 4vw;
		gap: 2.66667vw;
	}

	.footer .footerBox dl dt {
		font-size: 2.4vw;
	}

	.footer .footerBox dl dd ul li {
		font-size: 2.13333vw;
	}

	.footer .info {
		gap: 4vw;
	}

	.footer .footerBox dl dd ul {
		gap: 2.66667vw;
	}

	.footer .info>p {
		font-size: 2.13333vw;
	}

	.index_main {
		padding-top: 7.33333vw;
		padding-bottom: 26vw;
	}

	.main .upMatch {
		border-radius: 1.33333vw;
		padding: 2.66667vw;
	}

	.main .title {
		margin-bottom: 5.06667vw;
	}

	.main .title .illustrate img {
		width: 5.06667vw;
	}

	.main .title .illustrate span {
		font-size: 3.46667vw;
	}

	.main .title .see .linkBox>span {
		font-size: 2.4vw;
	}

	.main .title .see .linkBox .mark {
		width: 4.53333vw;
		height: 4.53333vw;
	}

	.main .title .see .linkBox .mark span {
		font-size: 2.13333vw;
	}

	.main .title .see .linkBox {
		gap: 2.66667vw;
	}

	.main .title .illustrate {
		gap: 2vw;
	}

	.main .upMatch .up_swiper {
		padding: 0 6.66667vw;
	}

	.main .upMatch .up_swiper .mySwiper .swiper-button-next,
	.main .upMatch .up_swiper .mySwiper .swiper-button-prev {
		border: 2.66667vw solid transparent;
	}

	.main .upMatch .up_swiper .mySwiper .swiper-button-next {
		border-left-color: #009dfe;
	}

	.main .upMatch .up_swiper .mySwiper .swiper-button-prev {
		border-right-color: #009dfe;
	}

	.main .upMatch .up_swiper .mySwiper .swiper-slide {
		padding: 2vw;
		border-radius: 1.33333vw;
	}

	.main .upMatch .up_swiper .mySwiper .swiper-slide .introBox .intro time,
	.main .upMatch .up_swiper .mySwiper .swiper-slide .introBox .intro span {
		font-size: 2.13333vw;
	}

	.main .upMatch .up_swiper .mySwiper .swiper-slide .introBox .status img {
		width: 4vw;
		height: 2.53333vw;
	}

	.main .upMatch .up_swiper .mySwiper .swiper-slide .contest .team .linkBox img {
		height: 8.66667vw;
	}

	.main .upMatch .up_swiper .mySwiper .swiper-slide .contest .vs .score span {
		font-size: 3.46667vw;
	}

	.main .upMatch .up_swiper .mySwiper .swiper-slide .contest .vs .state {
		font-size: 2.13333vw;
	}

	.main .upMatch .up_swiper .mySwiper .swiper-slide .contest .team .linkBox span {
		font-size: 2.13333vw;
	}

	.main .upMatch .up_swiper .mySwiper .swiper-slide .introBox .status span {
		font-size: 2.13333vw;
	}

	.main .newssuggest .newssuggestBox {
		gap: 5.33333vw;
		flex-direction: column;
	}

	.main .newssuggest {
		padding: 2.66667vw;
		margin: 10vw 0;
		border-radius: 1.33333vw;
	}

	.main .newssuggest .newssuggestBox .diagram {
		width: 100%;
	}

	.main .newssuggest .newssuggestBox .diagram ul li:first-child {
		height: 47.2vw;
		margin-bottom: 2.66667vw;
	}

	.main .newssuggest .newssuggestBox .diagram ul li figure .cover {
		border-radius: 1.33333vw;
	}

	.main .newssuggest .newssuggestBox .diagram ul li:first-child figure {
		border-radius: 2vw;
	}

	.main .newssuggest .newssuggestBox .diagram ul li:first-child figure figcaption {
		padding: 2vw 2.66667vw;
		font-size: 2.4vw;
	}

	.main .newssuggest .newssuggestBox .diagram ul li:nth-child(2) {
		margin-right: 2vw;
		width: calc(100% / 2 - 7vw / 7.5);
	}

	.main .newssuggest .newssuggestBox .diagram ul li {
		height: 35.73333vw;
	}

	.main .newssuggest .newssuggestBox .diagram ul li figure .cover {
		height: 23.2vw;
	}

	.main .newssuggest .newssuggestBox .diagram ul li:nth-child(2) figure figcaption,
	.main .newssuggest .newssuggestBox .diagram ul li:nth-child(3) figure figcaption {
		font-size: 2.13333vw;
	}

	.main .newssuggest .newssuggestBox .diagram ul li:nth-child(2) figure img,
	.main .newssuggest .newssuggestBox .diagram ul li:nth-child(3) figure img {
		border-radius: 1.33333vw;
	}

	.main .newssuggest .newssuggestBox .text ul {
		flex-direction: row;
		flex-wrap: wrap;
		gap: 2.4vw;
	}

	.main .newssuggest .newssuggestBox .text ul li {
		width: calc(100% / 2 - 9vw / 7.5);
	}

	.main .newssuggest .newssuggestBox .text ul li:nth-child(11) {
		margin-top: 0;
	}

	.main .newssuggest .newssuggestBox .text ul li:nth-child(11) .linkBox span {
		font-weight: normal;
		color: #555b65;
	}

	.main .newssuggest .newssuggestBox .text ul li .linkBox {
		gap: 1.33333vw;
	}

	.main .newssuggest .newssuggestBox .text ul li .linkBox span {
		font-size: 2.13333vw;
	}

	.main .newssuggest .newssuggestBox .text ul li .linkBox::before {
		width: 0.8vw;
		height: 0.8vw;
	}

	.main .wonderfulVideo {
		border-radius: 1.33333vw;
		padding: 2.66667vw;
	}

	.main .eventMatch .videoSelect {
		padding: 0 6.66667vw;
		margin-bottom: 5.73333vw;
	}

	.main .eventMatch .videoSelect .mySwiper .swiper-button-next,
	.main .eventMatch .videoSelect .mySwiper .swiper-button-prev {
		border: 2.66667vw solid transparent;
	}

	.main .eventMatch .videoSelect .mySwiper .swiper-button-prev {
		border-right-color: #009dfe;
	}

	.main .eventMatch .videoSelect .mySwiper .swiper-button-next {
		border-left-color: #009dfe;
	}

	.main .eventMatch .videoSelect .mySwiper .swiper-slide img {
		width: 13.6vw;
		height: 13.6vw;
	}

	.main .eventMatch .videoSelect .mySwiper .swiper-slide {
		gap: 2.66667vw;
	}

	.main .eventMatch .videoSelect .mySwiper .swiper-slide span {
		font-size: 2.66667vw;
	}

	.main .videoentry ul {
		gap: 2vw;
	}

	.main .videoentry ul li {
		width: calc(100% / 2 - 8vw / 7.5);
		height: 36.4vw;
		border-radius: 2vw;
	}

	.main .videoentry ul li .cover {
		height: 24.66667vw;
	}

	.main .videoentry ul li .cover .play {
		width: 12.66667vw;
		height: 11.33333vw;
	}

	.main .videoentry ul li .cover time {
		left: 1.06667vw;
		top: 1.06667vw;
		font-size: 2.13333vw;
	}

	.main .videoentry ul li .cover .duration {
		right: 1.06667vw;
		bottom: 1.06667vw;
		font-size: 2.13333vw;
	}

	.main .videoentry ul li .prove {
		padding: 1.33333vw 2.66667vw;
	}

	.main .videoentry ul li .prove p {
		font-size: 2.13333vw;
	}

	.main .videoentry ul li .prove .hot .source {
		font-size: 2.13333vw;
	}

	.main .videoentry ul li .prove .hot .heat {
		gap: 1.33333vw;
	}

	.main .videoentry ul li .prove .hot .heat span {
		font-size: 2.13333vw;
	}

	.main .videoentry ul li .prove .hot .heat .iconfont {
		font-size: 2.4vw;
	}

	.main .ranking {
		border-radius: 1.33333vw;
		padding: 2.66667vw;
		padding-bottom: 6.66667vw;
	}

	.main .ranking .billboard .integral {
		width: 100%;
		padding: 1.06667vw 0;
		border-radius: 2vw;
	}

	.main .ranking .billboard {
		gap: 2.66667vw;
	}

	.main .ranking .billboard .integral .integral_title img {
		height: 4.66667vw;
	}

	.main .ranking .billboard .integral .switch {
		padding: 1.33333vw;
	}

	.main .ranking .billboard .integral .switch ul li {
		font-size: 2.4vw;
		height: 4.66667vw;
		border-radius: 1.33333vw;
	}

	.main .ranking .billboard .integral .within ul li span {
		font-size: 2.66667vw;
	}

	.main .ranking .billboard .integral .within ul {
		gap: 2.66667vw;
		padding: 0 2vw;
	}

	.main .ranking .billboard .integral .within ul li .position {
		width: 4.26667vw;
		height: 4.66667vw;
		margin-left: 1.06667vw;
	}

	.main .ranking .billboard .integral .within ul li:nth-child(2) .position {
		width: 6.13333vw;
		height: 4.66667vw;
	}

	.main .ranking .billboard .integral .within ul li:nth-child(3) .position {
		width: 6.13333vw;
		height: 4.66667vw;
	}

	.main .ranking .billboard .integral .within ul li:nth-child(4) .position {
		width: 6.13333vw;
		height: 4.66667vw;
	}

	.main .ranking .billboard .integral .within ul li .team {
		gap: 2vw;
	}

	.main .ranking .billboard .integral .within ul li .team img {
		height: 5.33333vw;
	}

	.main .ranking .billboard .integral .within ul li .team span {
		font-size: 2.66667vw;
	}

	.main .eventMatch {
		border-radius: 1.33333vw;
		padding: 2.66667vw;
		margin-top: 10vw;
	}

	.main .eventMatch .tabulate .every {
		padding: 2.66667vw;
		gap: 2vw;
		border-radius: 2vw;
	}

	.main .eventMatch .tabulate .every .every_title {
		gap: 2vw;
	}

	.main .eventMatch .tabulate .every .every_title img {
		width: 2.66667vw;
		height: 2.66667vw;
	}

	.main .eventMatch .tabulate .every .every_title span {
		font-size: 2.4vw;
	}

	.main .eventMatch .tabulate .every .arrange span,
	.main .eventMatch .tabulate .every .arrange time,
	.main .eventMatch .tabulate .every .arrange a {
		font-size: 2.13333vw;
	}

	.main .eventMatch .tabulate .every .arrange .ranks .team img {
		width: 3.33333vw;
	}

	.main .eventMatch .tabulate .every .arrange .ranks {
		gap: 1.33333vw;
	}

	.main .eventMatch .tabulate .every .arrange .ranks .score span {
		font-size: 2.13333vw;
	}

	.main .eventMatch .tabulate .every .arrange .status {
		width: calc(100vw / 7.5);
		height: 3.33333vw;
	}

	.main .eventMatch .tabulate .every .arrange .status .linkBox {
		gap: 1.06667vw;
	}

	.main .eventMatch .tabulate .every .arrange .status .linkBox img {
		width: 2vw;
		height: 2vw;
	}

	.main .eventMatch .tabulate .every .arrange .ranks .team {
		gap: 1.33333vw;
	}

	.main .eventMatch .tabulate {
		gap: 2.66667vw;
	}

	.main .principalBox .principal .toggle {
		padding: 1.33333vw 2.66667vw;
	}

	.main .principalBox .principal .toggle ul li a {
		font-size: 2.13333vw;
	}

	.main .principalBox .principal .toggle ul {
		gap: 2vw;
	}

	.main .principalBox .principal .toggle ul li {
		height: 4.53333vw;
		border-radius: 1.33333vw;
	}

	.main .page .pagination {
		gap: 1.33333vw;
	}

	.main .page .pagination li {
		width: 6.4vw;
		height: 6.4vw;
	}

	.main .page .pagination li span,
	.page .pagination li a {
		font-size: 1.86667vw;
	}

	.main .page .pagination li span,
	.main .page .pagination li a {
		font-size: 2.13333vw;
	}

	.main .page .pagination .Jump {
		display: none;
	}

	.main .principalBox .aside {
		gap: 2.66667vw;
	}

	.main .principalBox .aside .popular {
		border-radius: 1.33333vw;
		padding: 2.66667vw;
		padding-bottom: 6.66667vw;
	}

	.main .simall_title {
		margin-bottom: 2.93333vw;
	}

	.main .simall_title .leftregion {
		gap: 1.33333vw;
	}

	.main .simall_title .leftregion img {
		height: 3.33333vw;
	}

	.main .simall_title .leftregion span {
		font-size: 2.13333vw;
	}

	.main .simall_title .rightregion a {
		gap: 1.33333vw;
	}

	.main .simall_title .rightregion a img {
		height: 2.93333vw;
	}

	.main .simall_title .rightregion a span {
		font-size: 2.13333vw;
	}

	.main .principalBox .aside .popular ul {
		gap: 1.33333vw;
	}

	.main .principalBox .aside .popular ul li a {
		font-size: 2.13333vw;
	}

	.main .principalBox .aside .recent {
		border-radius: 1.33333vw;
		padding: 2.66667vw;
		padding-bottom: 6.66667vw;
	}

	.main .principalBox .aside .recent .competition ul {
		gap: 2.66667vw;
	}

	.main .principalBox .aside .recent .competition ul li {
		width: calc(100% / 2 - 11vw / 7.5);
	}

	.main .principalBox .aside .recent .competition ul li .detailed span,
	.main .principalBox .aside .recent .competition ul li .detailed time {
		font-size: 2.13333vw;
	}

	.main .principalBox .aside .recent .competition ul li .contest .corps .team .linkBox {
		gap: 1.06667vw;
	}

	.main .principalBox .aside .recent .competition ul li .contest .corps .team .linkBox img {
		height: 4.26667vw;
	}

	.main .principalBox .aside .recent .competition ul li .contest .corps .team .linkBox span {
		font-size: 2.13333vw;
	}

	.main .principalBox .aside .recent .competition ul li .contest .status {
		width: 11.46667vw;
		height: 3.73333vw;
		border-radius: 1.86667vw;
	}

	.main .principalBox .aside .recent .competition ul li .contest .status a {
		font-size: 2.13333vw;
	}

	.main .principalBox .aside .information .collection ul li {
		width: 100%;
	}

	.main .principalBox .aside .information {
		border-radius: 1.33333vw;
		padding: 2.66667vw;
		padding-bottom: 6.66667vw;
	}

	.main .principalBox .aside .information .collection ul li p {
		padding: 1.33333vw 0;
		font-size: 2.13333vw;
	}

	.main .principalBox .aside .information .collection ul li img {
		height: 3.33333vw;
	}

	.main .principalBox .aside .videosuggest {
		border-radius: 1.33333vw;
		padding: 2.66667vw;
		padding-bottom: 6.66667vw;
	}

	.main .principalBox .aside .videosuggest .collect ul li .linkBox .cover {
		width: 35.73333vw;
		height: 21.73333vw;
		border-radius: 2vw;
	}

	.main .principalBox .aside .videosuggest .collect ul li .linkBox .cover .play {
		width: 6.66667vw;
		height: 6vw;
	}

	.main .principalBox .aside .videosuggest .collect ul li .linkBox .cover span {
		font-size: 2.13333vw;
		right: 1.06667vw;
		bottom: 1.06667vw;
	}

	.main .principalBox .aside .videosuggest .collect ul li .linkBox .clear p {
		font-size: 2.4vw;
	}

	.main .principalBox .aside .videosuggest .collect ul li .linkBox .clear time {
		font-size: 2.13333vw;
	}

	.newslistBox {
		border-radius: 1.33333vw;
		padding: 2.66667vw;
		padding-bottom: 6.66667vw;
		margin-top: 2.66667vw;
	}

	.newslistBox .newslist ul li figure {
		gap: 1.33333vw;
	}

	.newslistBox .newslist ul li figure .Img {
		width: 38vw;
		height: 19.06667vw;
		border-radius: 2vw;
	}

	.newslistBox .newslist ul li figure figcaption article {
		gap: 2.13333vw;
	}

	.newslistBox .newslist ul li figure figcaption article span {
		font-size: 2.4vw;
	}

	.newslistBox .newslist ul li figure figcaption article p {
		font-size: 2.13333vw;
	}

	.newslistBox .newslist ul li figure figcaption .intel time {
		font-size: 1.86667vw;
	}

	.newslistBox .newslist ul li figure figcaption .intel .heat {
		gap: 0.66667vw;
	}

	.newslistBox .newslist ul li figure figcaption .intel .heat .iconfont {
		font-size: 2.13333vw;
	}

	.newslistBox .newslist ul li figure figcaption .intel .heat span {
		font-size: 1.86667vw;
	}

	.main .news {
		border-radius: 1.33333vw;
		padding: 2.66667vw;
		padding-bottom: 6.66667vw;
	}

	.main .news article h1 {
		font-size: 3.2vw;
	}

	.main .news article .newsInfo {
		padding-top: 1.33333vw;
		padding-bottom: 2.66667vw;
		margin-top: 1.33333vw;
		gap: 2.66667vw;
	}

	.main .news article .newsInfo time,
	.main .news article .newsInfo span {
		font-size: 2.13333vw;
	}

	.main .news article img {
		width: 100% !important;
		padding: 0;
		border-radius: 2vw;
		margin-bottom: 2.66667vw;
	}

	.main .news article>p {
		font-size: 2.4vw;
		line-height: 4vw;
		margin-bottom: 2.66667vw;
	}

	.main .news .upDown {
		gap: 2.66667vw;
		margin-top: 15.33333vw;
		flex-direction: column;
	}

	.main .news .upDown li {
		padding: 0.93333vw;
		border-radius: 2.13333vw;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.main .news .upDown li a {
		font-size: 2.13333vw;
	}

	.main .news .treetop {
		padding: 1.86667vw 1.33333vw;
		gap: 1.33333vw;
		margin-top: 2.66667vw;
	}

	.main .news .treetop span {
		font-size: 2.13333vw;
	}

	.main .news .treetop ul li {
		padding: 0.26667vw 0.93333vw;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.main .news .treetop ul li a {
		font-size: 2.13333vw;
	}

	.main .correlation {
		margin-top: 3.2vw;
		border-radius: 1.33333vw;
		padding: 2.66667vw;
		padding-bottom: 6.66667vw;
	}

	.main .correlation .correlationlist ul li figure .cover {
		width: 40.66667vw;
		height: 19.06667vw;
		border-radius: 2vw;
	}

	.main .correlation .correlationlist ul li figure .cover .play {
		width: 6.66667vw;
		height: 6vw;
	}

	.main .correlation .correlationlist ul li figure .cover span {
		right: 0.66667vw;
		bottom: 0.66667vw;
		font-size: 1.86667vw;
	}

	.main .correlation .correlationlist ul li figure {
		gap: 1.33333vw;
	}

	.main .correlation .correlationlist ul li figure figcaption article {
		gap: 1.33333vw;
	}

	.main .correlation .correlationlist ul li figure figcaption article span {
		font-size: 2.4vw;
	}

	.main .correlation .correlationlist ul li figure figcaption article p {
		font-size: 2.13333vw;
	}

	.main .correlation .correlationlist ul li figure figcaption time {
		font-size: 1.86667vw;
	}

	.crumbs {
		margin-bottom: 2.66667vw;
		gap: 1.33333vw;
		border-radius: 2vw;
		padding: 2.66667vw;
	}

	.crumbs span {
		font-size: 2.13333vw;
		gap: 1.33333vw;
	}

	.crumbs span::before {
		width: 0.53333vw;
		height: 1.6vw;
		border-radius: 0.8vw;
	}

	.crumbs ul li a {
		font-size: 2.13333vw;
	}

	.crumbs ul li::after {
		font-size: 2.13333vw;
		margin: 0 0.66667vw;
	}

	.crumbs ul {
		padding-right: 2.66667vw;
	}

	.video {
		border-radius: 1.33333vw;
		padding: 2.66667vw;
		padding-bottom: 6.66667vw;
	}

	.main .article h1 {
		font-size: 3.2vw;
	}

	.main .article .newsInfo {
		padding-top: 1.33333vw;
		padding-bottom: 2.66667vw;
		margin-top: 1.33333vw;
		gap: 2.66667vw;
	}

	.main .article .newsInfo time,
	.main .article .newsInfo span {
		font-size: 2.13333vw;
	}

	.video .screen {
		height: 47.33333vw;
		border-radius: 2vw;
	}

	.video .screen .play {
		width: 20.8vw;
		height: 18.66667vw;
	}

	.video .gameBox {
		gap: 1.33333vw;
	}

	.video .gameBox .topInfo time,
	.video .gameBox .topInfo span {
		font-size: 2.13333vw;
	}

	.video .gameBox .game {
		gap: 2.66667vw;
		height: 28.26667vw;
	}

	.video .gameBox .game .vs time {
		font-size: 2.4vw;
		margin-bottom: 4.4vw;
	}

	.video .gameBox .game .team {
		gap: 2vw;
	}

	.video .gameBox .game .team img {
		height: 11.2vw;
	}

	.video .gameBox .game .team span {
		font-size: 2.13333vw;
		width: 20vw;
	}

	.video .gameBox .game .vs .score span {
		font-size: 4.8vw;
	}

	.video .gameBox .game .vs .status {
		font-size: 2.4vw;
		margin-top: 2.66667vw;
	}

	.video .signal {
		gap: 2vw;
		margin: 2.66667vw 0;
	}

	.video .signal span {
		gap: 0.66667vw;
		font-size: 2.13333vw;

	}

	.video .signal ul li a {
		font-size: 2.13333vw;
	}

	.video .signal span::before {
		height: 2vw;
	}

	.video .liveInfo ul {
		gap: 2vw;
	}

	.video .liveInfo ul li {
		gap: 1.33333vw;
	}

	.video .liveInfo ul li span {
		font-size: 2.13333vw;
	}

	.video .liveInfo ul li a {
		font-size: 2.13333vw;
	}

	.video .liveInfo {
		gap: 2vw;
	}

	.video .liveInfo p {
		font-size: 2.13333vw;
		line-height: 3.46667vw;
	}

	.confrontatiom {
		margin-top: 4.66667vw;
		border-radius: 1.33333vw;
		padding: 2.66667vw;
		padding-bottom: 6.66667vw;
	}

	.confrontatiom .election ul {
		gap: 2.66667vw;
	}

	.confrontatiom .election ul li {
		padding: 1.06667vw 2.26667vw;
		border-radius: 1.33333vw;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.confrontatiom .election ul li a {
		font-size: 2.4vw;
	}

	.confrontatiom .view>ul>li .view_title {
		gap: 0.66667vw;
		margin-bottom: 1.33333vw;
	}

	.confrontatiom .view>ul>li .view_title img {
		width: 2.93333vw;
	}

	.confrontatiom .view>ul>li .view_title span {
		font-size: 2.13333vw;
	}

	.confrontatiom .view>ul>li .history .record ul {
		gap: 2.66667vw;
	}

	.confrontatiom .view>ul>li .history .record ul .first {
		height: 4.4vw;
		border-radius: 1.33333vw;
	}

	.confrontatiom .view>ul>li .history .record ul li span,
	.confrontatiom .view>ul>li .history .record ul li time {
		font-size: 2.13333vw;
	}

	.confrontatiom .view>ul>li .military {
		margin-top: 2.66667vw;
	}

	.confrontatiom .view>ul>li .military .warband .team {
		gap: 0.93333vw;
	}

	.confrontatiom .view>ul>li .military .warband .team .troops img {
		height: 5.33333vw;
	}

	.confrontatiom .view>ul>li .military .warband .team .troops span {
		font-size: 2.13333vw;
	}

	.confrontatiom .view>ul>li .military .warband .team>p {
		font-size: 2.13333vw;
	}

	.confrontatiom .view>ul>li .military .table ul li {
		height: 7.06667vw;
	}

	.confrontatiom .view>ul>li .military .table ul li span {
		font-size: 2.13333vw;
		line-height: 7.06667vw;
	}

	body .main .view ul li .introduce .text {
		font-size: 1.86667vw;
		line-height: 3.73333vw;
	}

	body .main .view ul li .introduce .eventName ul li a {
		font-size: 1.86667vw;
	}

	body .main .view ul li .introduce .eventName ul li::before {
		width: 0.53333vw;
		height: 0.53333vw;
		margin-right: 1.33333vw;
	}

	body .main .view ul li .introduce .eventName ul li span {
		font-size: 1.86667vw;
	}

	body .main .view ul li .introduce {
		padding: 1.73333vw 2vw;
	}

	.analysis ul li .placeBox {
		padding-top: calc(88vw / 7.5);
		gap: calc(28vw / 7.5);
	}

	.analysis ul {
		flex-direction: column;
	}

	.analysis ul li {
		width: 100%;
		padding: 0 calc(24vw / 7.5);
		padding-bottom: calc(30vw / 7.5);
	}

	.analysis {
		margin-top: calc(59vw / 7.5);
	}

	.analysis ul li .place .vessel {
		gap: calc(40vw / 7.5);
	}

	.analysis ul li .place .vessel .text p:first-child {
		padding-bottom: calc(31vw / 7.5);
		padding-top: calc(13vw / 7.5);
	}

	.analysis ul li .place .vessel .text p {
		font-size: calc(18vw / 7.5);
	}

	.analysis ul li .likeness {
		width: calc(83vw / 7.5);
		height: calc(83vw / 7.5);
	}

	.analysis ul li .likeness img {
		width: calc(53vw / 7.5);
		height: calc(53vw / 7.5);
	}

	.analysis ul li .likenessBox span {
		font-size: calc(20vw / 7.5);
	}

	.analysis ul li .place .place_title {
		font-size: calc(20vw / 7.5);
	}

	.analysis ul li .place .place_title::before {
		height: 20px;
	}

	.analysis ul li .place .vessel .mark::before {
		height: calc(18vw / 7.5);
	}

	.main .matchlist .eventMatch {
		margin-top: 2.66667vw;
	}

	.big {
		gap: 2.66667vw;
	}

	.big .bigSelect ul {
		padding: 2.66667vw 0.66667vw;
	}

	.big .bigSelect ul li {
		gap: 2.13333vw;
		border-radius: 2vw;
	}

	.big .bigSelect ul li img {
		width: 4vw;
	}

	.big .bigSelect ul li span {
		font-size: 2.13333vw;
	}

	.big .bigContent {
		padding: 2.66667vw;
		border-radius: 1.33333vw;
		padding-bottom: 6.66667vw;
	}

	.big .bigContent ul li time,
	.big .bigContent ul li span,
	.big .bigContent ul li a {
		font-size: 2.4vw;
	}

	.big .bigContent ul li .troop .team .linkBox img {
		height: 4.4vw;
	}

	.big .bigContent ul li .troop .vs {
		font-size: 2.4vw;
	}

	.big .bigContent ul li .status {
		font-size: 2.4vw;
	}

	.multiple {
		gap: 2.66667vw;
		border-radius: 1.33333vw;
		padding: 2.66667vw;
		padding-bottom: 6.66667vw;
		margin-top: 4vw;
	}

	.multiple .multiple_title {
		gap: 1.33333vw;
	}

	.multiple .multiple_title img {
		width: 3.06667vw;
	}

	.multiple .multiple_title span {
		font-size: 2.4vw;
	}

	.multiple ul {
		gap: 1.33333vw;
	}

	.multiple ul li a {
		font-size: 2.13333vw;
	}

	body .footer .info .code {
		padding: 0 1.33333vw;
	}

	body .footer .info .code span {
		font-size: 2.13333vw;
	}

	body .footer .info .svgCode {
		height: 2.4vw;
	}

	body .footer .info .svgCode .codeFont {
		font-size: 2.4vw;
		transform: translateY(2.13333vw);
	}

	body .regard {
		gap: calc(10vw / 7.5);
	}

	body .video .eventName {
		margin-bottom: calc(20vw / 7.5);
		gap: calc(15vw / 7.5);
	}

	body .video .eventName ul li {
		font-size: calc(18vw / 7.5);
	}

	body .video .eventName>span,
	body .video .eventName p {
		font-size: calc(18vw / 7.5);

	}

	body .video .eventName ul {
		gap: calc(15vw / 7.5);
	}
}

.footer .info .code {
	display: flex;
	justify-content: center;
}

.footer .info .code span {
	font-size: 16px;
	color: #fff;
}

.footer .info .svgCode {
	width: auto;
	height: 14px;
	display: inline-block;
	vertical-align: middle;
}

.footer .info .svgCode .codeFont {
	font-size: 16px;
	transform: translateY(16px);
}

.regard {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
}

.video .eventName {
	display: flex;
	flex-direction: column;
	gap: 15px;
	margin-bottom: 20px;
}

.video .eventName ul {
	display: flex;
	flex-direction: column;
	gap: 15px;
}

.video .eventName ul li {
	white-space: nowrap;
	font-size: 14px;
	display: flex;
	align-items: center;
	color: #232d3e;
}

.video .eventName ul li a,
.video .eventName ul li span {
	color: #232d3e;
}


.video .eventName>span,
.video .eventName p {
	font-size: 14px;
}

.main .recordingtitle {
	position: absolute;
	left: 0;
	top: 0;
	display: flex;
	align-items: center;
	width: 100%;
	background-color: rgba(255, 255, 255, 0.5);
	backdrop-filter: blur(10px);
	padding: 5px;
	box-sizing: border-box;
	border-radius: 10px;
}

.main .recordingtitle span {
	font-size: 14px;
	color: #232d3e;
}


.main .recordingtitle a {
	flex: 1;
	white-space: nowrap;
	overflow: hidden;
	display: block;
	width: 100%;
	text-overflow: ellipsis;
	font-size: 14px;
	color: #232d3e;
}

.analysis ul li .place .qb-status-1 .text p {
	color: #6c757d !important;
}

.analysis ul li .place .qb-status-2 .text p {
	color: #ffc107 !important;
}

.analysis ul li .place .qb-status-3 .text p {
	color: #17a2b8 !important;
}

.analysis ul li .place .qb-status-4 .text p {
	color: #007bff !important;
}

.analysis ul li .place .qb-status-5 .text p {
	color: #dc3545 !important;
}

.confrontatiom .view>ul>li .war {
	display: flex;
	flex-direction: column;
	gap: 15px;
	margin-top: 20px;
}

.confrontatiom .view>ul>li .war .war_title {
	font-size: 16px;
	user-select: none;
}


.confrontatiom .view>ul>li .war .warContent {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
}

.confrontatiom .view>ul>li .war .warContent .outer {
	width: calc(100% / 2 - 10px);
	display: flex;
	flex-direction: column;
	gap: 30px;
}

.confrontatiom .view>ul>li .war .warContent .outer ul {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.confrontatiom .view>ul>li .war .warContent .outer ul li {
	display: flex;
}

.confrontatiom .view>ul>li .war .warContent .outer ul li .teamBox {
	width: 100%;
	overflow: hidden;
	display: grid;
	align-items: center;
	grid-template-columns: 3fr 2fr 3fr;
}

.confrontatiom .view>ul>li .war .warContent .outer ul li .team {
	width: 100%;
	display: flex;
	align-items: center;
	flex-direction: column;
	overflow: hidden;
}

.confrontatiom .view>ul>li .war .warContent .outer ul li .team img {
	width: auto;
	height: 40px;
}

.confrontatiom .view>ul>li .war .warContent .outer ul li .team p {
	white-space: nowrap;
	overflow: hidden;
	display: block;
	width: 100%;
	text-overflow: ellipsis;
	text-align: center;
	font-size: 14px;
	color: #727477;
}

.confrontatiom .view>ul>li .war .warContent .outer ul li .teamInfo {
	color: #727477;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 5px;
}

.confrontatiom .view>ul>li .war .warContent .outer ul li .teamInfo .vs {
	display: flex;
	align-items: center;
	text-align: center;
}

.confrontatiom .view>ul>li .war .warContent .outer ul li .teamInfo .linkBox {
	display: flex;
	flex-direction: column;
	gap: 5px;
}

.confrontatiom .view>ul>li .war .warContent .outer ul li .teamInfo .linkBox .vs {
	width: 100%;
	display: grid;
	align-items: center;
	grid-template-columns: 2fr 1fr 2fr;
	gap: 5px;
}

.confrontatiom .view>ul>li .war .warContent .outer ul li .teamInfo .linkBox .vs span {
	font-size: 16px;
	white-space: nowrap;
	text-align: center;
}

.confrontatiom .view>ul>li .war .warContent .outer ul li .teamInfo .linkBox .vs span:first-child {
	text-align: right;
}

.confrontatiom .view>ul>li .war .warContent .outer ul li .teamInfo .linkBox .vs span:last-child {
	text-align: left;
}

.confrontatiom .view>ul>li .war .warContent .outer ul li .teamInfo .linkBox time {
	width: 100%;
	text-align: center;
	font-size: 12px;
	white-space: nowrap;
}

.confrontatiom .view>ul>li .war .warContent .outer ul li .teamInfo .specs {
	white-space: nowrap;
	overflow: hidden;
	display: block;
	width: 100%;
	text-overflow: ellipsis;
	font-size: 12px;
	white-space: nowrap;
	text-align: center;
	color: #727477;
}

.confrontatiom .view>ul>li .war .warContent .outer .check {
	display: flex;
	align-items: center;
	justify-content: center;
}

.confrontatiom .view>ul>li .war .warContent .outer .check a {
	white-space: nowrap;
	color: #727477;
	font-size: 12px;
}

@media screen and (max-width:750px) {
	.confrontatiom .view>ul>li .war .war_title {
		font-size: 2.13333vw;
	}

	.confrontatiom .view>ul>li .war .warContent {
		gap: 2.66667vw;
	}

	.confrontatiom .view>ul>li .war .warContent .outer ul {
		gap: 2.66667vw;
	}

	.confrontatiom .view>ul>li .war .warContent .outer {
		width: calc(100% / 2 - 10vw / 7.5);
	}

	.confrontatiom .view>ul>li .war {
		gap: 2vw;
	}

	.confrontatiom .view>ul>li .war .warContent .outer ul li .team img {
		height: 5.33333vw;
	}

	.confrontatiom .view>ul>li .war .warContent .outer ul li .team p {
		font-size: 2.4vw;
	}

	.confrontatiom .view>ul>li .war .warContent .outer ul li .teamInfo .vs {
		gap: 0.66667vw;
	}

	.confrontatiom .view>ul>li .war .warContent .outer ul li .teamInfo .vs span {
		font-size: 2.4vw;
	}

	.confrontatiom .view>ul>li .war .warContent .outer ul li .teamInfo {
		gap: 0.66667vw;
	}

	.confrontatiom .view>ul>li .war .warContent .outer ul li .teamInfo time {
		font-size: 2.13333vw;
	}

	.confrontatiom .view>ul>li .war .warContent .outer ul li .teamInfo .specs {
		font-size: 2.13333vw;
	}

	.confrontatiom .view>ul>li .war .warContent .outer .check a {
		font-size: 2.13333vw;
	}
}

.contain {
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 13px 0;
	gap: 5px;
}

.contain li {
	position: relative;
	padding: 0 10px;
	cursor: pointer;
	text-align: center;
}

.contain li::after {
	content: "";
	position: absolute;
	left: 50%;
	transform: translate(-50%, 100%);
	bottom: 0;
	height: 2px;
	width: 0;
	background: rgba(0, 157, 254, 0.7);
	transition: all 0.3s;
}

.contain li.is_active::after {
	width: 100%;
}

.contain li.is_active span {
	color: #009dfe !important;
}

.contain li:hover::after {
	width: 100%;
}

.contain li:hover span {
	color: #009dfe !important;
}

.contain li span {
	font-size: 14px;
	font-weight: bold;
	color: #323a48;
}

@media screen and (max-width: 768px) {
	.contain {
		margin: 12px 0;
		gap: 5px;
	}

	.contain li {
		padding: 0 5px;
	}

	.contain li span {
		font-size: 12px;
	}
}

.baskLive {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 3px;
	display: none;
}

.baskLive .period {
	display: flex;
	flex-direction: column;
}

.baskLive .period time {
	padding: 0 3px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	color: #323a48;
}

.baskLive .deliver {
	width: 100%;
	border: 1px solid #ebebeb;
}

.baskLive .deliver li {
	display: grid;
	align-items: center;
	gap: 7px;
	height: 48px;
	box-sizing: border-box;
	grid-template-columns: auto 5fr 1fr;
	padding: 10px;
	border-top: 1px solid #ebebeb;
}

.baskLive .deliver li .plump {
	width: 30px;
	height: fit-content;
}

.baskLive .deliver li .plump img {
	width: 100%;
	height: auto;
}

.baskLive .deliver li p {
	width: 100%;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	font-size: 14px;
	color: #323a48;
}

.baskLive .deliver li .condition {
	display: grid;
	grid-template-columns: auto 1fr auto;
	gap: 5px;
	user-select: none;
}

.baskLive .deliver li .condition img {
	width: 24px;
	height: auto;
}

.baskLive .deliver li .condition span {
	font-size: 14px;
	letter-spacing: 3px;
	white-space: nowrap;
	text-align: center;
	color: #323a48;
}


.text_foot_live {
	display: grid;
	grid-template-columns: auto 1fr;
}

.text_foot_live .quantum {
	width: fit-content;
}

.text_foot_live .quantum ul {
	display: flex;
	flex-direction: column;
}

.text_foot_live .quantum ul li {
	padding: 0 3px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.text_foot_live .quantum ul li span {
	font-size: 14px;
	color: #323a48;
}

.text_foot_live .describe {
	width: 100%;
	border: 1px solid #ebebeb;
}

.text_foot_live .describe ul {
	width: 100%;
}

.text_foot_live .describe ul li {
	display: grid;
	align-items: center;
	gap: 7px;
	height: 48px;
	box-sizing: border-box;
	grid-template-columns: auto 1fr auto;
	padding: 10px;
	border-top: 1px solid #ebebeb;
}

.text_foot_live .describe ul li:first-child {
	border-top: none;
}

.text_foot_live .describe ul li .icon_live {
	width: 18px;
	height: 18px;
}

.text_foot_live .describe ul li p {
	width: 100%;
	font-size: 14px;
	width: 100%;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	color: #323a48;
}

.text_foot_live .describe ul li .plump {
	width: 22px;
	height: auto;
}

.all_principal {
	width: 100% !important;
}

.schedule-columnn {
	--theme--color: #009dfe;
	--theme--deputy--color: #fff;
	width: 100%;
	height: fit-content;
	display: grid;
	background: var(--theme--deputy--color);
	grid-template-columns: repeat(2, 1fr);
	margin-bottom: 20px;
}

.schedule-columnn li {
	height: 58px;
	cursor: pointer;
}

.schedule-columnn li a {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	color: #727477;
}

.schedule-columnn li span {
	font-size: 16px;
	font-weight: bold;
}

.schedule-columnn li img {
	height: 28px;
	width: 28px;
	border-radius: 50%;
}

.schedule-columnn li.active,
.schedule-columnn li:hover {
	background: var(--theme--color);
}

.schedule-columnn li.active a,
.schedule-columnn li:hover a {
	color: var(--theme--deputy--color);
}

.schedule-nav {
	width: 100%;
	overflow-x: auto;
}

.schedule-nav ul {
	--theme--color: #1784d5;
	--theme--deputy--color: #fff;
	width: 100%;
	height: fit-content;
	display: flex;
	justify-content: space-between;
	margin-bottom: 10px;
}

.schedule-nav ul li {
	min-width: 138px;
	height: 60px;
	background: var(--theme--deputy--color);
}

.schedule-nav ul li a {
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	text-align: center;
	justify-content: center;
	color: #010b12;
	font-weight: bold;
	cursor: pointer;
}

.schedule-nav ul li span {
	font-size: 14px;
	font-weight: bold;
}

.schedule-nav ul li.active,
.schedule-nav ul li:hover {
	background: var(--theme--color);
}

.schedule-nav ul li.active a,
.schedule-nav ul li:hover a {
	color: var(--theme--deputy--color);

}

@media screen and (max-width: 768px) {
	.match_outer {
		padding: 0 1.333vw;
		box-sizing: border-box;
	}

	.match_outer .schedule-columnn {
		margin-bottom: 2.667vw;
	}

	.match_outer .schedule-columnn li {
		height: 7.733vw;
	}

	.match_outer .schedule-columnn li a {
		gap: 1.333vw;
	}

	.match_outer .schedule-columnn li span {
		font-size: 2.133vw;
	}

	.match_outer .schedule-columnn li img {
		height: 3.733vw;
		width: 3.733vw;
	}

	.match_outer .schedule-nav {
		overflow-x: auto;
		margin-bottom: 1.333vw;
	}

	.match_outer .schedule-nav ul {
		width: fit-content;
		gap: 1.067vw;
		margin-bottom: 1.333vw;
	}

	.match_outer .schedule-nav li {
		min-width: 26.8vw;
		height: 8vw;
	}

	.match_outer .schedule-nav li time,
	.match_outer .schedule-nav li span {
		font-size: 2.2vw;
	}
}